<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ include file="/WEB-INF/jsp/web/commons/global.jsp"%>

<div class="articles-wrapper">
	<div class="items">
		<c:forEach items="${articles }" var="article">
			<div class="item">
				<a href="${baseUrl }/article/${article.id}.html" target="_blank">
					<div class="item-main item-left-bd">
						<h4>
							<c:if test="${not empty  article.coverUrl}">
								<img alt="${article.title }" src="${article.coverUrl}"
									class="img-circle" style="width: 20px; height: 20px;">
							</c:if>${article.title }
						</h4>
						<div class="tips">编自:${article.copyWebsiteName }-${article.showTime }-游览次数:${article.statistics.countWatch }</div>
						<div class="clear-both"></div>
						<p class="desc hid">
							<c:if test="${not empty  article.coverUrl}">
								<img alt="${article.title }" src="${article.coverUrl}"
									class="img-circle" style="width: 100px; height: 100px;">
							</c:if>
							${article.summary }
						</p>
					</div>
				</a>
			</div>
		</c:forEach>
	</div>
</div>

<div class="vertical-spacing-20"></div>
<div class="article-pagination-wrapper">
	<div class="content">
		<ul class="pagination page-ul">

			<c:if test="${pagination.index > 1}">
				<li class="page-item"><a href="javascript:;"
					onclick="getArticleList(${empty param.cat ? 0 : param.cat},${empty param.sort ? 0 : param.sort},${empty param.progress ? 0 : param.progress},${pagination.index - 1})">&laquo;</a></li>
				<li class="page-item"><a href="javascript:;"
					onclick="getArticleList(${empty param.cat ? 0 : param.cat},${empty param.sort ? 0 : param.sort},${empty param.progress ? 0 : param.progress},1)">首页</a></li>
			</c:if>

			<c:forEach begin="${pagination.index }" end="${pagination.index + 7}"
				varStatus="pageStatus">
				<c:if test="${pageStatus.index <= pagination.pages}">
					<c:choose>
						<c:when test="${pageStatus.first }">
							<li class="page-item cur-page"><a href="javascript:;">${pageStatus.index
																}</a></li>
						</c:when>
						<c:otherwise>
							<li class="page-item"><a href="javascript:;"
								onclick="getArticleList(${empty param.cat ? 0 : param.cat},${empty param.sort ? 0 : param.sort},${empty param.progress ? 0 : param.progress},${pageStatus.index })">${pageStatus.index
																}</a></li>
						</c:otherwise>
					</c:choose>
				</c:if>
			</c:forEach>

			<c:if test="${pagination.index < pagination.pages}">
				<li class="page-item"
					onclick="getArticleList(${empty param.cat ? 0 : param.cat},${empty param.sort ? 0 : param.sort},${empty param.progress ? 0 : param.progress},${pagination.index + 1})"><a
					href="javascript:;">&raquo;</a></li>
				<li class="page-item"
					onclick="getArticleList(${empty param.cat ? 0 : param.cat},${empty param.sort ? 0 : param.sort},${empty param.progress ? 0 : param.progress},${pagination.pages} )"><a
					href="javascript:;">尾页</a></li>
			</c:if>

			<!-- 													<li class="page-item has-more"><a href="javascript:;">&hellip;</a></li> -->
		</ul>
	</div>
</div>


<script type="text/javascript">

$(function() {
	$(".content-wrapper .cur-articles-wrapper .articles-wrapper .items .item")
			.hover(function() {
				var _this = $(this);
				_this.find(".desc").slideDown("fast");
			}, function() {
				var _this = $(this);
				_this.find(".desc").slideUp("fast");
			});
});
</script>


